<!DOCTYPE HTML>
<html>

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>甘特图</title>

  <link rel=stylesheet href="platform.css" type="text/css">
  <link rel=stylesheet href="libs/jquery/dateField/jquery.dateField.css" type="text/css">

  <link rel=stylesheet href="gantt.css" type="text/css">
  <link rel=stylesheet href="ganttPrint.css" type="text/css" media="print">
  <link rel=stylesheet href="libs/jquery/valueSlider/mb.slider.css" type="text/css" media="print">

  <!-- 下拉选择框CSS -->
  <link rel="stylesheet" href="libs/css/selectivity-jquery.css">
	<link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css">
  <!-- <link rel="stylesheet" href="libs/css/stylesheet.css"> -->

  <!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> -->
  <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
  <script src="http://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"></script>
  <!-- <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> -->

  <script src="libs/jquery/jquery.livequery.1.1.1.min.js"></script>
  <script src="libs/jquery/jquery.timers.js"></script>

  <script src="libs/utilities.js"></script>
  <script src="libs/forms.js"></script>
  <script src="libs/date.js"></script>
  <script src="libs/dialogs.js"></script>
  <script src="libs/layout.js"></script>
  <script src="libs/i18nJs.js"></script>
  <script src="libs/jquery/dateField/jquery.dateField.js"></script>
  <script src="libs/jquery/JST/jquery.JST.js"></script>
  <script src="libs/jquery/valueSlider/jquery.mb.slider.js"></script>

  <script type="text/javascript" src="libs/jquery/svg/jquery.svg.min.js"></script>
  <script type="text/javascript" src="libs/jquery/svg/jquery.svgdom.1.8.js"></script>

  <script src="ganttUtilities.js"></script>
  <script src="ganttTask.js"></script>
  <script src="ganttDrawerSVG.js"></script>
  <script src="ganttZoom.js"></script>
  <script src="ganttGridEditor.js"></script>
  <script src="ganttMaster.js"></script>

  <!--<script src="libs/profiling.js"></script>-->
  <!--<script type="text/javascript" src="ganttTestSuite.js"></script>-->
</head>

<body style="background-color: #fff;">

  <div  class="position_auto" style="display: none; left: -482px;">
    <!-- 修改工位 -->
    <div id="SelectDepname" class="selectivity-input example-input" ></div>
  </div>
  <div  class="position_auto" style="display: none;left: 482px;">
    <!-- 修改责任人 -->
    <div id="SelectUsers" class="selectivity-input example-input" ></div>
  </div>

  <div style="margin: 15px;">
    班次:<input type="text" style="width: 130px; margin-right: 8px;">
    规则:<input type="text" onfocus="myFunction()" style="width: 130px;margin-right: 8px;">
    每周工作天数:<select id="weekday" style="width: 130px;border-radius: 3px;">
      <option value="STATUS_ACTIVE" class="taskStatus" status="STATUS_ACTIVE">5</option>
      <option value="STATUS_WAITING" class="taskStatus" status="STATUS_WAITING">6</option>
      <option value="STATUS_SUSPENDED" class="taskStatus" status="STATUS_SUSPENDED">7</option>
    </select>
    计划开始日期:<input style="width: 130px;" type="text" name="start" size="8" class="formElements dateField validated date"
      autocomplete="off" maxlength="255" value="" oldvalue="1" entrytype="DATE"
      onclick="$(this).dateField({inputField:$(this),isSearchField:false});">
    <!-- <label for="">是否统计周六日</label><input name="sex" type="radio"> -->
    <button class="addForm button">排程计算</button>
    <button class="addForm button">生成工单</button>
    <!-- <button id="csssss">生成工单</button> -->
  </div>
  <div id="workSpace"
    style="padding:0px; overflow-y:auto; overflow-x:hidden;border:1px solid #e5e5e5;position:relative;margin:0 5px">
    <div id="messagebox"
      style="z-index: 999;width:180px;height:200px;padding:8px;background:#fff;position: absolute;display: none;border:0.5px solid rgb(201, 196, 196)">
      <h4 style="text-align: center;margin: 0; padding: 0;">任务详情</h4>
      <p>任务名称: <span class="name">测试1</span></p>
      <p>计划开始: <span class="start">2017-12-03</span></p>
      <p>计划结束: <span class="end">2020-03-18</span></p>
      <p>完成比率: <span class="progress">25</span>%</p>
    </div>
  </div>

  <style>
    .resEdit {
      padding: 15px;
    }

    .resLine {
      width: 95%;
      padding: 3px;
      margin: 5px;
      border: 1px solid #d0d0d0;
    }

    body {
      overflow: hidden;
    }

    .ganttButtonBar h1 {
      color: #000000;
      font-weight: bold;
      font-size: 28px;
      margin-left: 10px;
    }
    .position_auto{
      width: 250px;
      height: 42px;
      position: absolute;
      top:0;
      left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
      z-index: 999;
    }
  </style>

  <form id="gimmeBack" style="display:none;" action="../gimmeBack.jsp" method="post" target="_blank"><input
      type="hidden" name="prj" id="gimBaPrj"></form>

  <script type="text/javascript">
    var ge;
    var project = loadFromLocalStorage();
    var taskindex=0
    $(function () {
      var canWrite = true; //this is the default for test purposes

      // here starts gantt initialization
      ge = new GanttMaster();
      ge.set100OnClose = true;

      ge.shrinkParent = true;

      //TODO:朱书彦 是否自动显示bar
      ge.isBrowserTaskBar = true;

      ge.init($("#workSpace"));
      loadI18n(); //overwrite with localized ones

      //in order to force compute the best-fitting zoom level
      delete ge.gantt.zoom;


      if (!project.canWrite)
        $(".ganttButtonBar button.requireWrite").attr("disabled", "true");

      ge.loadProject(project);
      ge.checkpoint(); //empty the undo stack

      initializeHistoryManagement(ge.tasks[0].id);
    });


    // 改变每周工作日函数
    var weekday = '5';
    $('#weekday').change(function () {
      weekday = $(this).find("option:selected").text()
      ge.loadProject(project);
      ge.redraw()
      // $('#workSpace').trigger('refreshTasks.gantt');
    })

    $('.addForm').click(function () {
      // console.log(project);
      project = {
        "tasks": [{
            "id": -1,
            "name": "Gantt editor",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 0,
            "status": "STATUS_ACTIVE",
            "depends": "",
            "canWrite": true,
            "start": 1450842466320,
            "duration": 20,
            "end": 1450842866320,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": true
          },
          {
            "id": -2,
            "name": "coding",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 1,
            "status": "STATUS_ACTIVE",
            "depends": "",
            "canWrite": true,
            "start": 1396994400000,
            "duration": 10,
            "end": 1398203999999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": true
          },
          {
            "id": -3,
            "name": "gantt part",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_ACTIVE",
            "depends": "",
            "canWrite": true,
            "start": 1396994400000,
            "duration": 2,
            "end": 1397167199999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false
          },
          {
            "id": -4,
            "name": "editor part",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_SUSPENDED",
            "depends": "3",
            "canWrite": true,
            "start": 1397167200000,
            "duration": 4,
            "end": 1397685599999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false
          },
          {
            "id": -5,
            "name": "testing",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 1,
            "status": "STATUS_SUSPENDED",
            "depends": "2:5",
            "canWrite": true,
            "start": 1398981600000,
            "duration": 5,
            "end": 1399586399999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": true
          }
        ],
        "selectedRow": 2,
        "deletedTaskIds": [],
        "resources": [{
            "id": "tmp_1",
            "name": "Resource 1"
          },
          {
            "id": "tmp_2",
            "name": "Resource 2"
          },
          {
            "id": "tmp_3",
            "name": "Resource 3"
          },
          {
            "id": "tmp_4",
            "name": "Resource 4"
          }
        ],
        "roles": [{
            "id": "tmp_1",
            "name": "Project Manager"
          },
          {
            "id": "tmp_2",
            "name": "Worker"
          },
          {
            "id": "tmp_3",
            "name": "Stakeholder"
          },
          {
            "id": "tmp_4",
            "name": "Customer"
          }
        ],
        "canWrite": true,
        "canDelete": true,
        "canWriteOnParent": true,
        canAdd: true
      }
      loadI18n();
      ge.loadProject(project);

    })

    function getDemoProject() {
      //console.debug("getDemoProject")
      ret = {
        "tasks": [{
            "id": -1,
            "name": "Gantt editor",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 0,
            "status": "STATUS_ACTIVE",
            "depends": "",
            "canWrite": true,
            "start": 1396994400000,
            "duration": 20,
            "end": 1399586399999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": true,
            "depname": ['工位一', '工位二'],
            "users": ['张三', '李四', '王二']
          },
          {
            "id": -2,
            "name": "coding",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 1,
            "status": "STATUS_ACTIVE",
            "depends": "",
            "canWrite": true,
            "start": 1396994400000,
            "duration": 0,
            "end": 1398203999999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": true,
            "depname": ['工位二'],
            "users": ['张三', '李四']
          },
          {
            "id": -3,
            "name": "gantt part",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_ACTIVE",
            "depends": "",
            "canWrite": true,
            "start": 1396994400000,
            "duration": 2,
            "end": 1397167199999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false,
            "depname": ['工位一', '工位二','工位五'],
            "users": ['张三', '李四', '王二','裴六']
          },
          {
            "id": -4,
            "name": "editor part",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_SUSPENDED",
            "depends": "3",
            "canWrite": true,
            "start": 1397167200000,
            "duration": 4,
            "end": 1397685599999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false
          },
          {
            "id": -5,
            "name": "testing",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 1,
            "status": "STATUS_SUSPENDED",
            "depends": "2:5",
            "canWrite": true,
            "start": 1398981600000,
            "duration": 5,
            "end": 1399586399999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": true
          },
          {
            "id": -6,
            "name": "test on safari",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_SUSPENDED",
            "depends": "",
            "canWrite": true,
            "start": 1398981600000,
            "duration": 2,
            "end": 1399327199999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false
          },
          {
            "id": -7,
            "name": "test on ie",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_SUSPENDED",
            "depends": "6",
            "canWrite": true,
            "start": 1399327200000,
            "duration": 3,
            "end": 1399586399999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false
          },
          {
            "id": -8,
            "name": "test on chrome",
            "progress": 0,
            "progressByWorklog": false,
            "relevance": 0,
            "type": "",
            "typeId": "",
            "description": "",
            "code": "",
            "level": 2,
            "status": "STATUS_SUSPENDED",
            "depends": "6",
            "canWrite": true,
            "start": 1399327200000,
            "duration": 2,
            "end": 1399499999999,
            "startIsMilestone": false,
            "endIsMilestone": false,
            "collapsed": false,
            "assigs": [],
            "hasChild": false
          }
        ],
        "selectedRow": 2,
        "deletedTaskIds": [],
        "resources": [{
            "id": "tmp_1",
            "name": "Resource 1"
          },
          {
            "id": "tmp_2",
            "name": "Resource 2"
          },
          {
            "id": "tmp_3",
            "name": "Resource 3"
          },
          {
            "id": "tmp_4",
            "name": "Resource 4"
          }
        ],
        "roles": [{
            "id": "tmp_1",
            "name": "Project Manager"
          },
          {
            "id": "tmp_2",
            "name": "Worker"
          },
          {
            "id": "tmp_3",
            "name": "Stakeholder"
          },
          {
            "id": "tmp_4",
            "name": "Customer"
          }
        ],
        "canWrite": true,
        "canDelete": true,
        "canWriteOnParent": true,
        canAdd: true
      }


      //actualize data
      var offset = new Date().getTime() - ret.tasks[0].start;
      for (var i = 0; i < ret.tasks.length; i++) {
        ret.tasks[i].start = ret.tasks[i].start + offset;
      }
      return ret;
    }



    function loadGanttFromServer(taskId, callback) {

      //this is a simulation: load data from the local storage if you have already played with the demo or a textarea with starting demo data
      var ret = loadFromLocalStorage();

      //this is the real implementation
      /*
      //var taskId = $("#taskSelector").val();
      var prof = new Profiler("loadServerSide");
      prof.reset();

      $.getJSON("ganttAjaxController.jsp", {CM:"LOADPROJECT",taskId:taskId}, function(response) {
        //console.debug(response);
        if (response.ok) {
          prof.stop();

          ge.loadProject(response.project);
          ge.checkpoint(); //empty the undo stack

          if (typeof(callback)=="function") {
            callback(response);
          }
        } else {
          jsonErrorHandling(response);
        }
      });
      */

      return ret;
    }

    function upload(uploadedFile) {
      var fileread = new FileReader();

      fileread.onload = function (e) {
        var content = e.target.result;
        var intern = JSON.parse(content); // Array of Objects.
        //console.log(intern); // You can index every object

        ge.loadProject(intern);
        ge.checkpoint(); //empty the undo stack

      };

      fileread.readAsText(uploadedFile);
    }

    function saveGanttOnServer() {
      // console.log(project,987654321);

      //this is a simulation: save data to the local storage or to the textarea
      //saveInLocalStorage();

      var prj = ge.saveProject();

      // download(JSON.stringify(prj, null, '\t'), "MyProject.json", "application/json");
      console.log(prj);

      /*

      delete prj.resources;
      delete prj.roles;

      var prof = new Profiler("saveServerSide");
      prof.reset();

      if (ge.deletedTaskIds.length>0) {
        if (!confirm("TASK_THAT_WILL_BE_REMOVED\n"+ge.deletedTaskIds.length)) {
          return;
        }
      }

      $.ajax("ganttAjaxController.jsp", {
        dataType:"json",
        data: {CM:"SVPROJECT",prj:JSON.stringify(prj)},
        type:"POST",

        success: function(response) {
          if (response.ok) {
            prof.stop();
            if (response.project) {
              ge.loadProject(response.project); //must reload as "tmp_" ids are now the good ones
            } else {
              ge.reset();
            }
          } else {
            var errMsg="Errors saving project\n";
            if (response.message) {
              errMsg=errMsg+response.message+"\n";
            }

            if (response.errorMessages.length) {
              errMsg += response.errorMessages.join("\n");
            }

            alert(errMsg);
          }
        }

      });
      */
    }

    // Function to download data to a file
    function download(data, filename, type) {
      var file = new Blob([data], {
        type: type
      });
      if (window.navigator.msSaveOrOpenBlob) // IE10+
        window.navigator.msSaveOrOpenBlob(file, filename);
      else { // Others
        var a = document.createElement("a"),
          url = URL.createObjectURL(file);
        a.href = url;
        a.download = filename;
        document.body.appendChild(a);
        a.click();
        setTimeout(function () {
          document.body.removeChild(a);
          window.URL.revokeObjectURL(url);
        }, 0);
      }
    }

    function newProject() {
      clearGantt();
    }


    function clearGantt() {
      ge.reset();
    }

    //-------------------------------------------  Get project file as JSON (used for migrate project from gantt to Teamwork) ------------------------------------------------------
    function getFile() {
      $("#gimBaPrj").val(JSON.stringify(ge.saveProject()));
      $("#gimmeBack").submit();
      $("#gimBaPrj").val("");

      /*  var uriContent = "data:text/html;charset=utf-8," + encodeURIComponent(JSON.stringify(prj));
       neww=window.open(uriContent,"dl");*/
    }


    function loadFromLocalStorage() {
      var ret;
      if (localStorage) {
        if (localStorage.getObject("teamworkGantDemo")) {
          ret = localStorage.getObject("teamworkGantDemo");
        }
      }

      //if not found create a new example task
      if (!ret || !ret.tasks || ret.tasks.length == 0) {
        ret = getDemoProject();
        // console.log(ret);
      }
      return ret;
    }


    function saveInLocalStorage() {
      var prj = ge.saveProject();

      if (localStorage) {
        localStorage.setObject("teamworkGantDemo", prj);
      }
    }


    //-------------------------------------------  Open a black popup for managing resources. This is only an axample of implementation (usually resources come from server) ------------------------------------------------------
    function editResources() {

      //make resource editor
      var resourceEditor = $.JST.createFromTemplate({}, "RESOURCE_EDITOR");
      var resTbl = resourceEditor.find("#resourcesTable");

      for (var i = 0; i < ge.resources.length; i++) {
        var res = ge.resources[i];
        resTbl.append($.JST.createFromTemplate(res, "RESOURCE_ROW"))
      }


      //bind add resource
      resourceEditor.find("#addResource").click(function () {
        resTbl.append($.JST.createFromTemplate({
          id: "new",
          name: "resource"
        }, "RESOURCE_ROW"))
      });

      //bind save event
      resourceEditor.find("#resSaveButton").click(function () {
        var newRes = [];
        //find for deleted res
        for (var i = 0; i < ge.resources.length; i++) {
          var res = ge.resources[i];
          var row = resourceEditor.find("[resId=" + res.id + "]");
          if (row.length > 0) {
            //if still there save it
            var name = row.find("input[name]").val();
            if (name && name != "")
              res.name = name;
            newRes.push(res);
          } else {
            //remove assignments
            for (var j = 0; j < ge.tasks.length; j++) {
              var task = ge.tasks[j];
              var newAss = [];
              for (var k = 0; k < task.assigs.length; k++) {
                var ass = task.assigs[k];
                if (ass.resourceId != res.id)
                  newAss.push(ass);
              }
              task.assigs = newAss;
            }
          }
        }

        //loop on new rows
        var cnt = 0
        resourceEditor.find("[resId=new]").each(function () {
          cnt++;
          var row = $(this);
          var name = row.find("input[name]").val();
          if (name && name != "")
            newRes.push(new Resource("tmp_" + new Date().getTime() + "_" + cnt, name));
        });

        ge.resources = newRes;

        closeBlackPopup();
        ge.redraw();
      });


      var ndo = createModalPopup(400, 500).append(resourceEditor);
    }

    function initializeHistoryManagement(taskId) {

      //retrieve from server the list of history points in millisecond that represent the instant when the data has been recorded
      //response: {ok:true, historyPoints: [1498168800000, 1498600800000, 1498687200000, 1501538400000, …]}
      $.getJSON(contextPath + "/applications/teamwork/task/taskAjaxController.jsp", {
        CM: "GETGANTTHISTPOINTS",
        OBJID: taskId
      }, function (response) {

        //if there are history points
        if (response.ok == true && response.historyPoints && response.historyPoints.length > 0) {

          //add show slider button on button bar
          var histBtn = $("<button>").addClass("button textual icon lreq30 lreqLabel").attr("title", "SHOW_HISTORY")
            .append("<span class=\"teamworkIcon\">&#x60;</span>");

          //clicking it
          histBtn.click(function () {
            var el = $(this);
            var ganttButtons = $(".ganttButtonBar .buttons");

            //is it already on?
            if (!ge.element.is(".historyOn")) {
              ge.element.addClass("historyOn");
              ganttButtons.find(".requireCanWrite").hide();

              //load the history points from server again
              showSavingMessage();
              $.getJSON(contextPath + "/applications/teamwork/task/taskAjaxController.jsp", {
                CM: "GETGANTTHISTPOINTS",
                OBJID: ge.tasks[0].id
              }, function (response) {
                jsonResponseHandling(response);
                hideSavingMessage();
                if (response.ok == true) {
                  var dh = response.historyPoints;
                  if (dh && dh.length > 0) {
                    //si crea il div per lo slider
                    var sliderDiv = $("<div>").prop("id", "slider").addClass("lreq30 lreqHide").css({
                      "display": "inline-block",
                      "width": "500px"
                    });
                    ganttButtons.append(sliderDiv);

                    var minVal = 0;
                    var maxVal = dh.length - 1;

                    $("#slider").show().mbSlider({
                      rangeColor: '#2f97c6',
                      minVal: minVal,
                      maxVal: maxVal,
                      startAt: maxVal,
                      showVal: false,
                      grid: 1,
                      formatValue: function (val) {
                        return new Date(dh[val]).format();
                      },
                      onSlideLoad: function (obj) {
                        this.onStop(obj);

                      },
                      onStart: function (obj) {},
                      onStop: function (obj) {
                        var val = $(obj).mbgetVal();
                        showSavingMessage();
                        /**
                         * load the data history for that milliseconf from server
                         * response in this format {ok: true, baselines: {...}}
                         *
                         * baselines: {61707: {duration:1,endDate:1550271599998,id:61707,progress:40,startDate:1550185200000,status:"STATUS_WAITING",taskId:"3055"},
                         *            {taskId:{duration:in days,endDate:in millis,id:history record id,progress:in percent,startDate:in millis,status:task status,taskId:"3055"}....}}                     */

                        $.getJSON(contextPath +
                          "/applications/teamwork/task/taskAjaxController.jsp", {
                            CM: "GETGANTTHISTORYAT",
                            OBJID: ge.tasks[0].id,
                            millis: dh[val]
                          },
                          function (response) {
                            jsonResponseHandling(response);
                            hideSavingMessage();
                            if (response.ok) {
                              ge.baselines = response.baselines;
                              ge.showBaselines = true;
                              ge.baselineMillis = dh[val];
                              ge.redraw();
                            }
                          })

                      },
                      onSlide: function (obj) {
                        clearTimeout(obj.renderHistory);
                        var self = this;
                        obj.renderHistory = setTimeout(function () {
                          self.onStop(obj);
                        }, 200)

                      }
                    });
                  }
                }
              });


              // closing the history
            } else {
              //remove the slider
              $("#slider").remove();
              ge.element.removeClass("historyOn");
              if (ge.permissions.canWrite)
                ganttButtons.find(".requireCanWrite").show();

              ge.showBaselines = false;
              ge.baselineMillis = undefined;
              ge.redraw();
            }

          });
          $("#saveGanttButton").before(histBtn);
        }
      })
    }

    function showBaselineInfo(event, element) {
      //alert(element.attr("data-label"));
      $(element).showBalloon(event, $(element).attr("data-label"));
      ge.splitter.secondBox.one("scroll", function () {
        $(element).hideBalloon();
      })
    }
  </script>





  <div id="gantEditorTemplates" style="display:none;">
    <div class="__template__" type="GANTBUTTONS">
      <!--
  <div class="ganttButtonBar noprint">
    <div class="buttons">

      <button onclick="$('#workSpace').trigger('undo.gantt');return false;" class="button textual icon requireCanWrite" title="undo"><span class="teamworkIcon">&#39;</span></button>
      <button onclick="$('#workSpace').trigger('redo.gantt');return false;" class="button textual icon requireCanWrite" title="redo"><span class="teamworkIcon">&middot;</span></button>
      <span class="ganttButtonSeparator requireCanWrite requireCanAdd"></span>
      <button onclick="$('#workSpace').trigger('addAboveCurrentTask.gantt');return false;" class="button textual icon requireCanWrite requireCanAdd" title="insert above"><span class="teamworkIcon">l</span></button>
      <button onclick="$('#workSpace').trigger('addBelowCurrentTask.gantt');return false;" class="button textual icon requireCanWrite requireCanAdd" title="insert below"><span class="teamworkIcon">X</span></button>
      <span class="ganttButtonSeparator requireCanWrite requireCanInOutdent"></span>
      <button onclick="$('#workSpace').trigger('outdentCurrentTask.gantt');return false;" class="button textual icon requireCanWrite requireCanInOutdent" title="un-indent task"><span class="teamworkIcon">.</span></button>
      <button onclick="$('#workSpace').trigger('indentCurrentTask.gantt');return false;" class="button textual icon requireCanWrite requireCanInOutdent" title="indent task"><span class="teamworkIcon">:</span></button>
      <span class="ganttButtonSeparator requireCanWrite requireCanMoveUpDown"></span>
      <button onclick="$('#workSpace').trigger('moveUpCurrentTask.gantt');return false;" class="button textual icon requireCanWrite requireCanMoveUpDown" title="move up"><span class="teamworkIcon">k</span></button>
      <button onclick="$('#workSpace').trigger('moveDownCurrentTask.gantt');return false;" class="button textual icon requireCanWrite requireCanMoveUpDown" title="move down"><span class="teamworkIcon">j</span></button>
      <span class="ganttButtonSeparator requireCanWrite requireCanDelete"></span>
      <button onclick="$('#workSpace').trigger('deleteFocused.gantt');return false;" class="button textual icon delete requireCanWrite" title="Elimina"><span class="teamworkIcon">&cent;</span></button>
      <span class="ganttButtonSeparator"></span>
      <button onclick="$('#workSpace').trigger('expandAll.gantt');return false;" class="button textual icon " title="EXPAND_ALL"><span class="teamworkIcon">6</span></button>
      <button onclick="$('#workSpace').trigger('collapseAll.gantt'); return false;" class="button textual icon " title="COLLAPSE_ALL"><span class="teamworkIcon">5</span></button>

    <span class="ganttButtonSeparator"></span>
      <button onclick="$('#workSpace').trigger('zoomMinus.gantt'); return false;" class="button textual icon " title="zoom out"><span class="teamworkIcon">)</span></button>
      <button onclick="$('#workSpace').trigger('zoomPlus.gantt');return false;" class="button textual icon " title="zoom in"><span class="teamworkIcon">(</span></button>
    <span class="ganttButtonSeparator"></span>
      <button onclick="$('#workSpace').trigger('print.gantt');return false;" class="button textual icon " title="Print"><span class="teamworkIcon">p</span></button>
    <span class="ganttButtonSeparator"></span>
      <button onclick="ge.gantt.showCriticalPath=!ge.gantt.showCriticalPath; ge.redraw();return false;" class="button textual icon requireCanSeeCriticalPath" title="CRITICAL_PATH"><span class="teamworkIcon">&pound;</span></button>
    <span class="ganttButtonSeparator requireCanSeeCriticalPath"></span>
      <button onclick="ge.splitter.resize(.1);return false;" class="button textual icon" ><span class="teamworkIcon">F</span></button>
      <button onclick="ge.splitter.resize(50);return false;" class="button textual icon" ><span class="teamworkIcon">O</span></button>
      <button onclick="ge.splitter.resize(100);return false;" class="button textual icon"><span class="teamworkIcon">R</span></button>
      <span class="ganttButtonSeparator"></span>
      <button onclick="ge.element.toggleClass('colorByStatus' );return false;" class="button textual icon"><span class="teamworkIcon">&sect;</span></button>

      &nbsp; &nbsp;
      <button onclick="saveGanttOnServer();" class="button first big requireWrite" title="Save">Save</button>
      <button onclick='newProject();' class='button requireWrite newproject'><em>clear project</em></button>
      <button class="button login" title="login/enroll" onclick="loginEnroll($(this));" style="display:none;">login/enroll</button>
      <button class="button opt collab" title="Start with Twproject" onclick="collaborate($(this));" style="display:none;"><em>collaborate</em></button>
    </div>

    <div>
    </div>
  </div>
  -->
    </div>

    <div class="__template__" type="TASKSEDITHEAD">
      <!--
  <table class="gdfTable" cellspacing="0" cellpadding="0">
    <thead>
    <tr style="height:40px">
      <th class="gdfColHeader" style="width:35px; border-right: none">序号</th>
      <th class="gdfColHeader" style="width:25px;"></th>
      <th class="gdfColHeader gdfResizable" style="width:200px;">任务名</th>
      <th class="gdfColHeader"  align="center" style="width:17px;" title="Start date is a milestone."><span class="teamworkIcon" style="font-size: 8px;">^</span></th>
      <th class="gdfColHeader gdfResizable" style="width:80px;">开始时间</th>
      <th class="gdfColHeader"  align="center" style="width:17px;" title="End date is a milestone."><span class="teamworkIcon" style="font-size: 8px;">^</span></th>
      <th class="gdfColHeader gdfResizable" style="width:80px;">结束时间</th>
      <th class="gdfColHeader gdfResizable" style="width:50px;">工期</th>
      <th class="gdfColHeader gdfResizable" style="width:60px;">完成量%</th>
      <th class="gdfColHeader gdfResizable requireCanSeeDep" style="width:50px;">前置</th>
      <th class="gdfColHeader gdfResizable" style="width:200px; text-align: left; padding-left: 10px;">工位</th>
      <th class="gdfColHeader gdfResizable" style="width:1000px; text-align: left; padding-left: 10px;">负责人</th>
    </tr>
    </thead>
  </table>
  -->
    </div>

    <div class="__template__" type="TASKROW">
      <!--
  <tr id="tid_(#=obj.id#)" taskId="(#=obj.id#)" class="taskEditRow (#=obj.isParent()?'isParent':''#) (#=obj.collapsed?'collapsed':''#)" level="(#=level#)">
    <th class="gdfCell edit" align="right" style="cursor:pointer;"><span class="taskRowIndex">(#=obj.getRow()+1#)</span> <span class="teamworkIcon" style="font-size:12px;" >e</span></th>
    <td class="gdfCell noClip" align="center"><div class="taskStatus cvcColorSquare" status="(#=obj.status#)"></div></td>
    <td class="gdfCell indentCell" style="padding-left:(#=obj.level*10+18#)px;">
      <div class="exp-controller" align="center"></div>
      <input type="text" name="name" value="(#=obj.name#)" placeholder="name">
    </td>
    <td class="gdfCell" align="center"><input type="checkbox" name="startIsMilestone"></td>
    <td class="gdfCell"><input type="text" name="start"  value="" class="date"></td>
    <td class="gdfCell" align="center"><input type="checkbox" name="endIsMilestone"></td>
    <td class="gdfCell"><input type="text" name="end" value="" class="date"></td>
    <td class="gdfCell"><input type="text" name="duration" autocomplete="off" value="(#=obj.duration#)"></td>
    <td class="gdfCell"><input type="text" name="progress" class="validated" entrytype="PERCENTILE" autocomplete="off" value="(#=obj.progress?obj.progress:''#)" (#=obj.progressByWorklog?"readOnly":""#)></td>
    <td class="gdfCell requireCanSeeDep"><input type="text" name="depends" autocomplete="off" value="(#=obj.depends#)" (#=obj.hasExternalDep?"readonly":""#)></td>
    <td class="gdfCell">(#=obj.depname#)</td>
    <td class="gdfCell ">(#=obj.users#)</td>
  </tr>
  -->
    </div>

    <div class="__template__" type="TASKEMPTYROW">
      <!--
  <tr class="taskEditRow emptyRow" >
    <th class="gdfCell" align="right"></th>
    <td class="gdfCell noClip" align="center"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell requireCanSeeDep"></td>
    <td class="gdfCell"></td>
    <td class="gdfCell"></td>
  </tr>
  -->
    </div>

    <div class="__template__" type="TASKBAR">
      <!--
  <div class="taskBox taskBoxDiv" taskId="(#=obj.id#)" >
    <div class="layout (#=obj.hasExternalDep?'extDep':''#)">
      <div class="taskStatus" status="(#=obj.status#)"></div>
      <div class="taskProgress" style="width:(#=obj.progress>100?100:obj.progress#)%; background-color:(#=obj.progress>100?'red':'rgb(153,255,51);'#);"></div>
      <div class="milestone (#=obj.startIsMilestone?'active':''#)" ></div>
      <div class="taskLabel"></div>
      <div class="milestone end (#=obj.endIsMilestone?'active':''#)" ></div>
    </div>
  </div>
  -->
    </div>


    <div class="__template__" type="CHANGE_STATUS">
      <!--
    <div class="taskStatusBox">
    <div class="taskStatus cvcColorSquare" status="STATUS_ACTIVE" title="Active"></div>
    <div class="taskStatus cvcColorSquare" status="STATUS_DONE" title="Completed"></div>
    <div class="taskStatus cvcColorSquare" status="STATUS_FAILED" title="Failed"></div>
    <div class="taskStatus cvcColorSquare" status="STATUS_SUSPENDED" title="Suspended"></div>
    <div class="taskStatus cvcColorSquare" status="STATUS_WAITING" title="Waiting" style="display: none;"></div>
    <div class="taskStatus cvcColorSquare" status="STATUS_UNDEFINED" title="Undefined"></div>
    </div>
  -->
    </div>




    <div class="__template__" type="TASK_EDITOR">

      <div class="ganttTaskEditor">
        <h2 class="taskData">修改</h2>
        <table cellspacing="1" cellpadding="5" width="100%" class="taskData table" border="0">
          <tr>
            <!-- <td width="200" style="height: 80px"  valign="top">
          <label for="code">code/short name</label><br>
          <input id="SelectDepname" class="selectivity-input example-input">
        </td> -->
            <td colspan="3" valign="top"><label for="name" class="required">任务名</label><br><input type="text"
                name="name" id="name" class="formElements" autocomplete='off' maxlength=255 style='width:100%' value=""
                required="true" oldvalue="1"></td>
          </tr>


          <tr class="dateRow">
            <td nowrap="">
              <div style="position:relative">
                <label for="start">开始时间</label>&nbsp;&nbsp;&nbsp;&nbsp;
                <input type="checkbox" id="startIsMilestone" name="startIsMilestone" value="yes"> &nbsp;<label
                  for="startIsMilestone">是否锁定</label>&nbsp;
                <br><input type="text" name="start" id="start" size="8" class="formElements dateField validated date"
                  autocomplete="off" maxlength="255" value="" oldvalue="1" entrytype="DATE">
                <span title="calendar" id="starts_inputDate" class="teamworkIcon openCalendar"
                  onclick="$(this).dateField({inputField:$(this).prevAll(':input:first'),isSearchField:false});">m</span>
              </div>
            </td>
            <td nowrap="">
              <label for="end">结束时间</label>&nbsp;&nbsp;&nbsp;&nbsp;
              <input type="checkbox" id="endIsMilestone" name="endIsMilestone" value="yes"> &nbsp;<label
                for="endIsMilestone">是否锁定</label>&nbsp;
              <br><input type="text" name="end" id="end" size="8" class="formElements dateField validated date"
                autocomplete="off" maxlength="255" value="" oldvalue="1" entrytype="DATE">
              <span title="calendar" id="ends_inputDate" class="teamworkIcon openCalendar"
                onclick="$(this).dateField({inputField:$(this).prevAll(':input:first'),isSearchField:false});">m</span>
            </td>
            <td nowrap="">
              <label for="duration" class=" ">工期</label><br>
              <input type="text" name="duration" id="duration" size="4" class="formElements validated durationdays"
                title="Duration is in working days." autocomplete="off" maxlength="255" value="" oldvalue="1"
                entrytype="DURATIONDAYS">&nbsp;
            </td>
          </tr>

          <tr>
            <td colspan="2">
              <label for="status" class=" ">状态</label><br>
              <select id="status" name="status" class="taskStatus" status="(#=obj.status#)"
                onchange="$(this).attr('STATUS',$(this).val());">
                <option value="STATUS_ACTIVE" class="taskStatus" status="STATUS_ACTIVE">active</option>
                <option value="STATUS_WAITING" class="taskStatus" status="STATUS_WAITING">suspended</option>
                <option value="STATUS_SUSPENDED" class="taskStatus" status="STATUS_SUSPENDED">suspended</option>
                <option value="STATUS_DONE" class="taskStatus" status="STATUS_DONE">completed</option>
                <option value="STATUS_FAILED" class="taskStatus" status="STATUS_FAILED">failed</option>
                <option value="STATUS_UNDEFINED" class="taskStatus" status="STATUS_UNDEFINED">undefined</option>
              </select>
            </td>

            <td valign="top" nowrap>
              <label>完成量%</label><br>
              <input type="text" name="progress" id="progress" size="7" class="formElements validated percentile"
                autocomplete="off" maxlength="255" value="" oldvalue="1" entrytype="PERCENTILE">
            </td>
          </tr>

          </tr>
          <!-- <tr>
            <td colspan="4">
              <label for="description">备注</label><br>
              <textarea rows="3" cols="30" id="description" name="description" class="formElements" style="width:100%"></textarea>
            </td>
          </tr> -->
        </table>
        <div style="display: flex;justify-content: space-between; height: 150px;">
          <div>
            <h2>修改工位</h2>
          </div>
          <div style="margin-right:100px">
            <h2>修改责任人</h2>
          </div>
            <!-- <table cellspacing="1" cellpadding="0" width="100%" id="assigsTable">
              <tr>
                <th style="width:250px;">工位</th>
                <th style="width:30px;" id="addAssig"><span class="teamworkIcon" style="cursor: pointer">+</span></th>
              </tr>
              <tbody>
                <tr class="assigEditRow" >
                  <td>
                    <select name="resourceId"  class="formElements" style="width: 100%;">
                    <option value="STATUS_ACTIVE" class="taskStatus"></option>
                    <option value="STATUS_ACTIVE" class="taskStatus">5</option>
                    <option value="STATUS_WAITING" class="taskStatus">6</option>
                    <option value="STATUS_SUSPENDED" class="taskStatus">7</option>
                  </select>
                </td>
                  <td align="center"><span class="teamworkIcon delAssig del" style="cursor: pointer">d</span></td>
                </tr>
              </tbody>
            </table> 
          </div>-->
        </div>


        <div style="text-align: right; padding-top: 20px">
          <span id="saveButton" class="button first" onClick="$(this).trigger('saveFullEditor.gantt');">Save</span>
        </div>

      </div>

    </div>



    <div id="templant_task" class="__template__" type="ASSIGNMENT_ROW">


    </div>



    <div class="__template__" type="RESOURCE_EDITOR">
      <!--
  <div class="resourceEditor" style="padding: 5px;">

    <h2>Project team</h2>
    <table  cellspacing="1" cellpadding="0" width="100%" id="resourcesTable">
      <tr>
        <th style="width:100px;">name</th>
        <th style="width:30px;" id="addResource"><span class="teamworkIcon" style="cursor: pointer">+</span></th>
      </tr>
    </table>

    <div style="text-align: right; padding-top: 20px"><button id="resSaveButton" class="button big">Save</button></div>
  </div>
  -->
    </div>

    


    <div class="__template__" type="RESOURCE_ROW">
      <!--
  <tr resId="(#=obj.id#)" class="resRow" >
    <td ><input type="text" name="name" value="(#=obj.name#)" style="width:100%;" class="formElements"></td>
    <td align="center"><span class="teamworkIcon delRes del" style="cursor: pointer">d</span></td>
  </tr>
  
  -->
    </div>
   

  </div>
  <script type="text/javascript">
    $.JST.loadDecorator("RESOURCE_ROW", function (resTr, res) {
      resTr.find(".delRes").click(function () {
        $(this).closest("tr").remove()
      });
    });

    $.JST.loadDecorator("ASSIGNMENT_ROW", function (assigTr, taskAssig) {
      var resEl = assigTr.find("[name=resourceId]");
      var opt = $("<option>");
      resEl.append(opt);
      for (var i = 0; i < taskAssig.task.master.resources.length; i++) {
        var res = taskAssig.task.master.resources[i];
        opt = $("<option>");
        opt.val(res.id).html(res.name);
        if (taskAssig.assig.resourceId == res.id)
          opt.attr("selected", "true");
        resEl.append(opt);
      }
      var roleEl = assigTr.find("[name=roleId]");
      for (var i = 0; i < taskAssig.task.master.roles.length; i++) {
        var role = taskAssig.task.master.roles[i];
        var optr = $("<option>");
        optr.val(role.id).html(role.name);
        if (taskAssig.assig.roleId == role.id)
          optr.attr("selected", "true");
        roleEl.append(optr);
      }

      if (taskAssig.task.master.permissions.canWrite && taskAssig.task.canWrite) {
        assigTr.find(".delAssig").click(function () {
          var tr = $(this).closest("[assId]").fadeOut(200, function () {
            $(this).remove()
          });
        });
      }

    });


    function loadI18n() {
      GanttMaster.messages = {
        "CANNOT_WRITE": "不能编辑",
        "CHANGE_OUT_OF_SCOPE": "没有超出编辑范围更新父级的权限",
        "START_IS_MILESTONE": "开始是里程碑",
        "END_IS_MILESTONE": "结束时里程碑",
        "TASK_HAS_CONSTRAINTS": "任务包含约束",
        "GANTT_ERROR_DEPENDS_ON_OPEN_TASK": "错误：特定于开放的任务",
        "GANTT_ERROR_DESCENDANT_OF_CLOSED_TASK": "错误：衍生于关闭的任务",
        "TASK_HAS_EXTERNAL_DEPS": "任务包含外部依赖",
        "GANTT_ERROR_LOADING_DATA_TASK_REMOVED": "错误：加载被删除的任务",
        "ERROR_SETTING_DATES": "日期时间设置错误（依赖时间关系或父级任务工期）",
        "CIRCULAR_REFERENCE": "有无限循环参照",
        "CANNOT_DEPENDS_ON_ANCESTORS": "不能依赖父级任务",
        "CANNOT_DEPENDS_ON_DESCENDANTS": "不能依赖子级任务",
        "INVALID_DATE_FORMAT": "无效日期格式",
        "TASK_MOVE_INCONSISTENT_LEVEL": "任务移动非连续级别",

        "GANTT_QUARTER_SHORT": "trim.",
        "GANTT_SEMESTER_SHORT": "sem."
      };
    }



    function createNewResource(el) {
      var row = el.closest("tr[taskid]");
      var name = row.find("[name=resourceId_txt]").val();
      var url = contextPath + "/applications/teamwork/resource/resourceNew.jsp?CM=ADD&name=" + encodeURI(name);

      openBlackPopup(url, 700, 320, function (response) {
        //fillare lo smart combo
        if (response && response.resId && response.resName) {
          //fillare lo smart combo e chiudere l'editor
          row.find("[name=resourceId]").val(response.resId);
          row.find("[name=resourceId_txt]").val(response.resName).focus().blur();
        }

      });
    }

    $(document).on("change", "#load-file", function () {
      var uploadedFile = $("#load-file").prop("files")[0];
      upload(uploadedFile);
    });
    function mytdfocus() {
      alert(1)
    }
    $('#csssss').click(function(){
      $('.position_auto').fadeIn()
    })
  </script>




  <script src="libs/javascripts/selectivity-jquery.js"></script>
  <script src="libs/javascripts/main.js"></script>

  <script>
    $('#SelectDepname').selectivity({
      items: ['工位一', '工位二', '工位三', '工位四', '工位五',/*, ...*/ ],
      // items: [
      // { id: 1, text: 'Amsterdam' },
      // { id: 2, text: 'bmsterdam' },
      // { id: 3, text: 'cmsterdam' },
      // { id: 4, text: 'dmsterdam' },
      // { id: 5, text: 'emsterdam' },
      // ],
      multiple: true,
      placeholder: '请选择工位'
    });
    $('#SelectUsers').selectivity({
      items: ['张三', '李四','王二','赵虎','裴六','陈七' /*, ...*/ ],
      multiple: true,
      placeholder: '请选择责任人'
    });
  </script>
</body>

</html>